<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>


    <script type="text/javascript">
        // 目标对象
        const user = {
            name: "小小浩",
            age: 18,
            wife:{
                name: "敏怡",
                age: 19,
            }
        }
        // 把目标对象变成代理对象
        // 参数1：user----->target目标对象
        // 参数2：handlet ------>处理器对象，用来监视数据，及数据操作
        const proxyUser = new Proxy(user,{
            // 获取目标对的某个属性值
            get(target, prop){
                console.log("get方法")
                console.log(target)
                console.log(prop)
                return Reflect.get(target, prop)
            },
            // 修改目标对象的属性值、为目标对象添加新的属性
            set(target, prop, val){
                console.log("set方法")
                console.log(target)
                console.log(prop)
                console.log(val)
                return Reflect.set(target, prop, val)

            },
            // 删除目标对象上的某个属性
            deleteProperty(target, prop) {
                console.log("deleteProperty")
                return Reflect.deleteProperty(target, prop)
            }
        })
        console.log("123")
        // 通过代理对象获取目标对象中的某个属性值
        console.log(proxyUser.name)
        // 通过代理对象更新目标对象上的某个属性值
        proxyUser.name = "杨敬业"
        console.log(user)
        // 通过代理对象向目标对象中添加一个新的属性
        proxyUser.gender = "男"
        console.log(user)
        delete proxyUser.age
        console.log(user)
        // 更新目标对象中的某个属性对象中的属性值
        proxyUser.wife.name = "杨小浩"
        console.log(user)



    </script>
    
</body>
</html>